﻿<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>互联网医院</title>
    <link rel="shortcut icon" type="image/vnd.microsoft.icon" href="/resource/apple.ico" />
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="/lobsteruiframe/weui/css/weui.css" />
    <link rel="stylesheet" href="/lobsteruiframe/weui/css/weuix.css" />
    <script src="/lobsteruiframe/weui/js/zepto.min.js"></script>
    <script src="/lobsteruiframe/weui/js/zepto.weui.js"></script>
    <script src="/lobsteruiframe/weui/js/swipe.js"></script>
    <script src="/lobsteruiframe/weui/js/macy.js"></script>
    <script src="/lobsteruiframe/weui/js/php.js"></script>
    <script src="/jslib/lobster.js"></script>
    <script src="/jslib/template-web.js"></script>
    <style>
        .list {
            display: flex;
            flex-wrap: wrap;
        }

        /* .grids-small {
            display: flex;
            justify-content: space-around;
        } */

        .grids-small .grid {
            /* padding: 10px 14px; */
        }

        .weui-grid__icon {
            width: 85px !important;
            height: 85.5px !important;
        }

        .weui-grid__icon2 {
            width: 50px !important;
            height: 50px !important;
        }

        .cardinfodiv {
            position: absolute;
            height: 213px;
            width: auto;
            border-radius: 10px;
            background-color: #FFFFFF;
            top: 20px;
            /* bottom: 100px; */
            left: 0;
            right: 0;
            margin: 5px 10px;
            box-shadow: 0px 0px 5px #eee;
        }

        .cardinfodivyet {
            position: absolute;
            height: 170px;
            width: auto;
            border-radius: 10px;
            background-color: #FFFFFF;
            top: 20px;
            /* bottom: 100px; */
            left: 0;
            right: 0;
            margin: 5px 10px;
            box-shadow: 0px 0px 5px #eee;
            display: flex;
            align-items: center;
        }

        .patientimg {
            height: 100%;
            width: 100%;
        }

        .patientborder {
            height: 32px;
            width: 32px;
            margin: 0 4px;
            border-radius: 50px;
            border: 1px solid #ffffff;
        }

        .patientselect {
            border-color: #00BF5B;
        }

        .itembg {
            height: 80px;
            width: 100%;
            /* margin: 10px 30px; */
            box-sizing: border-box;
            padding: 0 10px;
        }

        .loginbtn {
            border: 1px solid #00BF5B;
            color: #00BF5B;
            height: 50px;
            width: auto;
            padding: 0 30px;
            box-sizing: border-box;
            margin: 10px 30px;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 25px;
            flex: 1
        }

        .weui-grids::before {
            display: none;
        }

        .weui-grid__label {
            margin-top: 0 !important;
        }
    </style>
</head>

<body ontouchstart>
    <div id='tb' class="weui-tab" style="height:auto;">
        <div class="weui-tab__panel">
            <!-- 首页 -->
            <div id="c0" class="weui-tab__content">
                <div>
                    <img src="images/index/bg.png" style="width: 100%;height: 153px; position: relative;" />
                </div>
                <div class="cardinfodivyet">
                    <div class="loginbtn">
                        请登录
                    </div>
                </div>
                <div class="cardinfodiv hide">
                    <div style="display: flex; margin: 5px 11px; position: relative;" id="patient">
                    </div>
                    <div style="margin: 10px 10px 10px 10px; position: relative;" id="patientcard">
                    </div>
                </div>
                <!--主功能图标-->
                <div class="weui-grids" id="div_abc" style="margin-top: 80px;">

                    <a href="javascript:;" class="grid zndz">
                        <div class="weui-grid__icon">
                            <img src="images/index/zndz1.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            导诊
                        </p>
                    </a>
                    <a href="javascript:;" class="grid toregister">
                        <div class="weui-grid__icon">
                            <img src="images/index/gh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            挂号
                        </p>
                    </a>
                    <a href="javascript:;" class="grid zzjf">
                        <div class="weui-grid__icon">
                            <img src="images/index/jf.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            缴费
                        </p>
                    </a>
                </div>
                <!-- 微站 -->
                <div style="margin-top: 10px;" id="div_website">
                    <img src="images/index/Internet.png" class="itembg" id="websit" />
                </div>
                <!-- 问卷 -->
                <div style="margin-top: 10px;" id="div_question">
                    <img src="images/index/question.png" class="itembg" id="question" />
                </div>
                <!-- 子功能图标 -->
                <div class="weui-grids grids-small" style="margin-top: 10px;" id="div_subfun">
                    <a href="javascript:;" class="grid zndz">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/zndz.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            智能导诊
                        </p>
                    </a>
                    <a href="javascript:;" class="grid toregister">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/yygh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            预约挂号
                        </p>
                    </a>
                    <a href="javascript:;" class="grid zzjf">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/zzjf.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            自助缴费
                        </p>
                    </a>
                    <a href="javascript:;" class="grid bgcx">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/bgcx.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            报告查询
                        </p>
                    </a>
                    <a href="javascript:;" class="grid twzx">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/yygh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            图文咨询
                        </p>
                    </a>
                    <a href="javascript:;" class="grid fzkf">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/yygh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            复诊开方
                        </p>
                    </a>
                    <a href="javascript:;" class="grid jksq">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/yygh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            健康社区
                        </p>
                    </a>
                    <a href="javascript:;" class="grid jksc">
                        <div class="weui-grid__icon weui-grid__icon2">
                            <img src="images/index/yygh.png" alt="">
                        </div>
                        <p class="weui-grid__label">
                            健康商城
                        </p>
                    </a>
                </div>
            </div>
            <!-- 我的 -->
            <div id="c1" class="weui-tab__content">
                <div class="page-bd-15">
                    <div class="weui-panel">
                        <div class="weui-panel__bd" id="loginkuai2">
                            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg" id="btnuser">
                                <div class="weui-media-box__hd">
                                    <div class="weui-avatar">
                                        <img id="imgUrl" src="/lobsteruiframe/weui/favicon.png" /><span
                                            class="weui-icon-success weui-icon-safe-warn"></span>
                                    </div>
                                </div>
                                <div class="weui-media-box__bd">
                                    <h4 id="nickName" class="weui-media-box__title">未登录</h4>
                                    <p id="userName" class="weui-media-box__desc"></p>
                                </div>
                            </a>
                        </div>

                    </div>

                    <div class="weui-cells" id="div_myfun">
                        <a class="weui-cell weui-cell_access" href="javascript:;" id="a_patientrecord">
                            <div class="weui-cell__bd weui-cell_primary">
                                <p>就诊人管理</p>
                            </div>
                            <span class="weui-cell__ft"></span>
                        </a>
                        <a class="weui-cell weui-cell_access" href="javascript:;" id="a_registerrecord">
                            <div class="weui-cell__bd weui-cell_primary">
                                <p>挂号记录</p>
                            </div>
                            <span class="weui-cell__ft"></span>
                        </a>
                        <a class="weui-cell weui-cell_access" href="javascript:;" id="a_payrecord">
                            <div class="weui-cell__bd weui-cell_primary">
                                <p>缴费记录</p>
                            </div>
                            <span class="weui-cell__ft"></span>
                        </a>
                    </div>
                    
                    <div class="weui-cells">
                        <a class="weui-cell weui-cell_access" href="javascript:;">
                            <div class="weui-cell__bd weui-cell_primary">
                                <p>帮助与反馈</p>
                            </div>
                            <span class="weui-cell__ft"></span>
                        </a>
                        <a class="weui-cell weui-cell_access" href="javascript:;">
                            <div class="weui-cell__bd weui-cell_primary">
                                <p>关于</p>
                            </div>
                            <span class="weui-cell__ft"></span>
                        </a>
                    </div>

                    <div class="weui-btn-area" id="divexit">
                        <a href="javascript:;" class="weui-btn weui-btn_warn" id="btnexit">退出登录</a>
                    </div>

                </div>
            </div>
        </div>

        <div class="weui-tabbar tab-bottom">
            <a href="javascript:;" class="weui-tabbar__item">
                <i class="icon icon-27 f27 weui-tabbar__icon"></i>
                <p class="weui-tabbar__label">首页</p>
            </a>
            <a href="javascript:;" class="weui-tabbar__item ">
                <i class="icon icon-30 f27 weui-tabbar__icon"></i>
                <p class="weui-tabbar__label">我的</p>
            </a>
        </div>
    </div>

</body>

</html>


<script>

    localStorage.setItem("WorkId", 2055);//设置默认登录机构

    lobsterh5.main({
        data: {
            patientcard: [], //就诊人以及就诊卡
            selectPatient: {},
            right: {},
            websiteId:lobsterh5.GetUrlParam('websiteId') || 3022
        },
        //初始化页面
        pageload: function () {
            var self = this;
            lobsterh5.AddPageState("tb", "tabbar");
            if (lobsterh5.hasLogin()) {
                $(".cardinfodivyet").hide();
                $(".cardinfodiv").show();
                $("#div_abc").css("margin-top", "80px")
                this.getpatientcard();
                this.getUserInfo();
                lobsterh5.GetLoginData((_right) => {
                    self.data.right = _right;
                })
            } else {
                $(".cardinfodivyet").show();
                $(".cardinfodiv").hide();
                $("#div_abc").css("margin-top", "40px")
            }
            this.initevent();
            this.initview();
        },
        initview:function(){
            var self = this;
            lobsterh5.GET('/admin/v1/CDecoration/GetCDecorationData',{workid:lobsterh5.GetWorkId(),pageid:1}).then(retdata=>{
                var dataview=retdata["data"];
                if(dataview && dataview.length>0){
                    dataview.forEach(item=>{
                        if(item.SectionCode=="01"){//就诊人卡片

                        }
                        else if(item.SectionCode=="02"){//主功能
                            $("#div_abc").empty();
                            var _html = template("tplmainfun", {list:JSON.parse(item.JsonData)});
                            $("#div_abc").html(_html);
                        }
                        else if(item.SectionCode=="03"){
                            $('#div_website').empty();
                            var tpldata=JSON.parse(item.JsonData);
                            tpldata.href=tpldata.href+'?workId='+lobsterh5.GetWorkId()+'&websiteId='+self.data.websiteId;
                            var _html=template("tplwebsite",tpldata);
                            $("#div_website").html(_html);
                        }
                        else if(item.SectionCode=="04"){
                            $('#div_question').empty();
                            var _html=template("tplquestion",JSON.parse(item.JsonData));
                            $("#div_question").html(_html);
                        }
                        else if(item.SectionCode=="05"){//次功能
                            $('#div_subfun').empty();
                            var _html = template("tplsubfun", {list:JSON.parse(item.JsonData)});
                            $("#div_subfun").html(_html);
                        }
                    })
                }
            })

            lobsterh5.GET('/admin/v1/CDecoration/GetCDecorationData',{workid:lobsterh5.GetWorkId(),pageid:2}).then(retdata=>{
                var dataview=retdata["data"];
                if(dataview && dataview.length>0){
                    dataview.forEach(item=>{
                        item.tpldata=JSON.parse(item.JsonData);
                        item.tpldata.href=item.tpldata.href.replace('#WorkId#',lobsterh5.GetWorkId());
                    })

                    $('#div_myfun').empty();
                    var _html = template("tplmyfun", {list:dataview});
                    $("#div_myfun").html(_html);
                }
            })
        },
        //初始化事件
        initevent: function () {
            var self = this;

           //-------------首页----------------------
            
            $(document).on("click", ".patientborder", function () {
                $(".patientborder").removeClass("patientselect");
                $(this).addClass('patientselect');
                var info = $(this).data("info");
                console.log(info);
                self.showpatientcard(info);
            });
            $(document).on("click", ".addpatient", function () {
                location.href = "/customer/patient/addpatient.html";
            });
            $(document).on("click", ".bindcard", function () {
                location.href = "/customer/patient/cardlist.html?patientId=" + self.data.selectPatient.Id;
            });
            $(document).on("click", ".loginbtn", function () {
                location.href = "/customer/login.html?callback=" + location.href;
            });

            //智能导诊
            // $(document).on("click", ".zndz", function () {
            //     $.toast("敬请期待", "text");
            // });

            //挂号
            // $(document).on("click", ".toregister", function () {
            //     $.toast("敬请期待", "text");
            // });
            
            //自助缴费
            // $(document).on("click", ".zzjf", function () {
            //     $.toast("敬请期待", "text");
            // });
            //微网站
            // $("#websit").click(function () {
            //     // $.toast("敬请期待", "text");
            //     location.href ='/weuiapp/3057/template/v1/index.html?workId='+lobsterh5.GetWorkId()+'&websiteId='+self.data.websiteId;
            // });

            //问卷
            // $("#question").click(function () {
            //     $.toast("敬请期待", "text");
            // });

            //报告查询
            // $(document).on("click", ".bgcx", function () {
            //     $.toast("敬请期待", "text");
            // });
            //图文咨询
            // $(document).on("click", ".twzx", function () {
            //     $.toast("敬请期待", "text");
            // });
            //复诊开方
            // $(document).on("click", ".fzkf", function () {
            //     $.toast("敬请期待", "text");
            // });

            //健康社区
            // $(document).on("click", ".jksq", function () {
            //     $.toast("敬请期待", "text");
            // });
            //健康商城
            // $(document).on("click", ".jksc", function () {
            //     $.toast("敬请期待", "text");
            // });

            $(document).on("click", "#setdefault", function () {
                var patientId = $(this).data("patientid");
                console.log(patientId);
                self.setdefault(patientId);
            });

            //-------------我的----------------------
            //显示退出登录按钮
            if (lobsterh5.hasLogin()) {
                $("#divexit").show();
            } else {
                $("#divexit").hide();
            }

            //编辑用户
            $("#btnuser").click(function () {
                if (lobsterh5.hasLogin()) {
                    location.href = "/customer/edituser.html";
                } else {
                    location.href = "/customer/login.html?callback=" + location.href;
                }
            });

            //就诊人
            // $("#a_patientrecord").click(function () {
            //     if (lobsterh5.hasLogin()) {
            //         location.href = "/customer/patient/patient.html?WorkId=" + lobsterh5.GetWorkId();
            //     } else {
            //         location.href = "/customer/login.html?callback=" + encodeURI("/customer/patient/patient.html?WorkId=" + lobsterh5.GetWorkId());
            //     }
            // });
            //挂号记录
            // $("#a_registerrecord").click(function () {
            //     $.toast("敬请期待", "text");
            // });
            //缴费记录
            // $("#a_payrecord").click(function () {
            //     $.toast("敬请期待", "text");
            // });
            //退出登录
            $("#btnexit").click(function () {
                if (lobsterh5.hasLogin()) {
                    $.confirm("确定要退出当前帐号吗？", function () {
                        var workId = lobsterh5.GetWorkId();
                        lobsterh5.ExitLogin();
                        location.href = 'index.html?WorkId=' + workId;
                    }, function () {
                        //点击取消后的回调函数
                    })
                }
            }); 

        },
        //获取登录用户信息
        getUserInfo: function () {
            lobsterh5.GetMPUserInfo(user => {
                $("#imgUrl").attr("src", user.ImgUrl);
                $("#nickName").text(user.Nickname);
                $("#userName").text("账号:" + user.UserName);
            });
        },
        //获取就诊人卡片
        getpatientcard() {
            var self = this;
            lobsterh5.GET("/admin/v1/CPatient/GetPatientCard").then(retdata => {
                if (retdata && retdata.patdata) {
                    var data = retdata.patdata.filter(p => p.Pid == -1);
                    data.forEach(item => {
                        if (item.Age < 18) {
                            if (item.Sex == 2) { //女
                                item.img = "nvhai";
                            } else {
                                item.img = "nanhai";
                            }
                        } else if (item.Age < 60 && item.Age >= 18) {
                            if (item.Sex == 2) { //女
                                item.img = "nvsheng";
                            } else {
                                item.img = "nansheng";
                            }
                        } else {
                            if (item.Sex == 2) { //女
                                item.img = "nainai";
                            } else {
                                item.img = "yeye";
                            }
                        }
                    })
                    self.data.patientcard = retdata.patdata;
                    //显示病人列表
                    self.inittemp("tplpatient", "patient", { list: data });
                }
                //显示第一张卡片
                if (self.data.patientcard && self.data.patientcard.length > 0) {
                    self.showpatientcard(self.data.patientcard[0]);
                }
            }).catch(res => {
                //$.toast(res.msg, 'forbidden');
            });
        },
        //显示卡片
        showpatientcard(info) {
            var self = this;
            self.data.selectPatient = info;
            var patientcard = self.data.patientcard.filter(p => p.Pid == info.Id && p.IsDefault == 1);
            var patientshowdata = {};
            if (patientcard && patientcard.length > 0) {
                patientcard.forEach(item => {
                    item.PatientId = info.Id;
                    item.PatientName = info.Name;
                })
                patientshowdata = patientcard[0];
            } else {
                patientshowdata.Type = 2;
                patientshowdata.PatientName = info.Name;
                patientshowdata.PatientId = info.Id;
                patientshowdata.Phone = info.Phone;
                patientshowdata.CardNo = info.IDCard;
            }
            patientshowdata.DefaultPatient = self.data.selectPatient.IsDefault;
            patientshowdata.WorkName = self.data.right.WorkName;
            patientshowdata.Phone = self.formartphone(patientshowdata.Phone);
            patientshowdata.CardNo = self.formartNum(patientshowdata.CardNo);

            self.inittemp("tplpatientcard", "patientcard", patientshowdata);
        },
        inittemp(tempid, _id, data) {
            var html = template(tempid, data);
            $("#" + _id).html(html);
        },
        formartphone(data) {
            if (!data) return "";
            if (data.length < 11) return data;
            return data.substring(0, 3) + "****" + data.substring(data.length - 4);
        },
        formartNum(data) {
            if (!data) return "";
            if (data.length < 11) return "**" + data.substring(data.length - 4);
            return data.substring(0, 3) + "********" + data.substring(data.length - 4);
        },
        setdefault(patientId) {
            
        },
    }, false);



</script>
<script type="text/template" id="tplpatient">
    {{if(list.length>0)}}
    {{each list }}
        <div class="patientborder {{$index ==0?'patientselect':''}}" data-info="{{$value}}">
            <img src="images/index/{{$value.img}}.png" class="patientimg" />
        </div>
    {{/each}}
    {{else}}

    {{/if}}

    <img src="images/index/addpatient.png" class="patientimg addpatient"
    style="height: 32px; width: 32px;margin-left: 3px;" />

    <div class="bindcard" style="position:absolute; top:0px;right:10px;display:flex;align-items: center;">
        <div class="page-hd-desc" style="border-radius:9px;background-color:#00BF5B;color:#FFFFFF;padding: 0px 10px;">去绑卡</div>
        <img src="images/index/ac.png" style="height:10px;width:6px; margin-left:10px"/>
    </div>
</script>
<script type="text/template" id="tplpatientcard">
     <img src="images/index/green.png" style="height: 153px; width: 100%;" /> 
    <div style="position: absolute; top:10px;left:20px;display:flex;align-items: flex-start;">
            <div style="width:35px;height:35px;">
                <img src="images/index/logo.png" style="width:100%;height:100%;"/>
            </div>
            <div >
                <div class="page-hd-title" style="flex:1;padding-left: 10px;">{{WorkName}}</div>
            </div>
            {{if(DefaultPatient==0)}}
            <!--<div style="    width: 120px; display: flex; justify-content: flex-end; " id="setdefault" data-patientid="{{PatientId}}">
                <label class="page-hd-desc label f-green b-green ">
                    设为默认
                </label>
            </div>-->
            {{/if}}
    </div>
   
    <div style="position: absolute; bottom:25px;left:20px">
        <div class="page-hd-title">{{PatientName}}</div>
        <div class="page-hd-desc">
           {{CardNo}}
        </div>
    </div>
</script>

<script type="text/template" id="tplmainfun">
    {{each list }}
    <a href="{{$value.href}}" class="grid">
        <div class="weui-grid__icon">
            <img src="{{$value.icon}}" alt="">
        </div>
        <p class="weui-grid__label">
            {{$value.text}}
        </p>
    </a>
    {{/each}}
</script>

<script type="text/template" id="tplwebsite">
    <a href="{{href}}"><img src="{{pic}}" class="itembg" id="websit" /></a>
</script>

<script type="text/template" id="tplquestion">
    <a href="{{href}}"><img src="{{pic}}" class="itembg" id="question" /></a>
</script>

<script type="text/template" id="tplsubfun">
    {{each list }}
    <a href="{{$value.href}}" class="grid">
        <div class="weui-grid__icon weui-grid__icon2">
            <img src="{{$value.icon}}" alt="">
        </div>
        <p class="weui-grid__label">
            {{$value.text}}
        </p>
    </a>
    {{/each}}
</script>

<script type="text/template" id="tplmyfun">
    {{each list }}
    <a class="weui-cell weui-cell_access" href="{{$value.tpldata.href}}" >
        <div class="weui-cell__bd weui-cell_primary">
            <p>{{$value.tpldata.text}}</p>
        </div>
        <span class="weui-cell__ft"></span>
    </a>
    {{/each}}
</script>